<template>
  <div class="Left" :class="{chang:$parent.quanwidth}">
    <router-link :to="{path:'/',query:{name:'欢迎界面',comName:'index'}}" style="cursor: pointer;">
      <img src="../assets/images/log.jpg" alt="" style="width: 60px;height: 60px;border-radius: 50%;margin-bottom: 5px;"/>
      <p>
        驾照通
        <small>license through</small>
      </p>
    </router-link>
    <ul style="height: calc(100% - 120px);overflow: auto;">
      <li class="menu" :class="{active:ismenu == i.num}" v-for="i in list">
        <p @click="setmenu(i.num)">
          <img :src="i.img" alt="" />
          <span v-if="$parent.quanwidth">{{i.name}}</span>
        </p>
        <img src="../assets/images/jiantou1.png" alt="" />
        <dl>
          <dd :class="{active:setactive(o.query.comName)}" v-for="o in i.data"><router-link :to="o">{{o.query.name}}</router-link></dd>
        </dl>
        <div>
          <p @click="setmenu(i.num)">
            实盘账号管理
            <img src="../assets/images/jiantou2.png" alt="" />
          </p>
          <router-link :class="{active:setactive(o.query.comName)}" v-for="o,index in i.data" :to="o"  :key="index">{{o.query.name}}</router-link>
        </div>
      </li>
      <!-- <li class="menu" :class="{active:ismenu == 1}">
        <p @click="setmenu(1)">
          <img src="../assets/images/leftbtn1_03.png" alt="" />
          <span v-if="$parent.quanwidth">实盘账号管理</span>
        </p>
        <img src="../assets/images/jiantou1.png" alt="" />
        <dl>
          <dd class="active"><router-link :to="{path:'/',query:{comName:'index1',name:'实盘账号1'}}">实盘账号1</router-link></dd>
          <dd><router-link :to="{path:'/',query:{comName:'index2',name:'实盘账号2'}}">实盘账号2</router-link></dd>
          <dd><router-link :to="{path:'/',query:{comName:'index3',name:'实盘账号3'}}">实盘账号3</router-link></dd>
        </dl>
        <div>
          <p @click="setmenu(1)">
            实盘账号管理
            <img src="../assets/images/jiantou2.png" alt="" />
          </p>
          <router-link :to="{path:'/',query:{comName:'index1',name:'实盘账号1'}}">实盘账号1</router-link>
          <router-link :to="{path:'/',query:{comName:'index2',name:'实盘账号2'}}">实盘账号2</router-link>
          <router-link :to="{path:'/',query:{comName:'index3',name:'实盘账号3'}}">实盘账号2</router-link>
        </div>
      </li>
      <li class="menu" :class="{active:ismenu == 2}">
        <p @click="setmenu(2)">
          <img src="../assets/images/leftbtn2_03.png" alt="" />
          <span v-if="$parent.quanwidth">s</span>
        </p>
        <img src="../assets/images/jiantou1.png" alt="" />
        <dl>

        </dl>
      </li>
      <li class="menu" :class="{active:ismenu == 3}">
        <p @click="setmenu(3)">
          <img src="../assets/images/leftbtn2_03.png" alt="" />
          <span v-if="$parent.quanwidth">交易参数设置</span>
        </p>
        <img src="../assets/images/jiantou1.png" alt="" />
        <dl>
          <dd class="active"><router-link to="">交易所设置</router-link></dd>
          <dd><router-link to="">期货商设置</router-link></dd>
          <dd><router-link to="">品种设置</router-link></dd>
          <dd><router-link to="">合约设置</router-link></dd>
          <dd><router-link to="">接口设置</router-link></dd>
          <dd><router-link to="">汇率设置</router-link></dd>
        </dl>
        <div>
          <p @click="setmenu(3)">
            交易参数设置
            <img src="../assets/images/jiantou2.png" alt="" />
          </p>
          <router-link to="" class="active">品种设置</router-link>
        </div>
      </li> -->
    </ul>
  </div>
</template>

<script>
var datalist = require('@/leftconfig');
// console.log(datalist)
export default {
  name: 'Left',
  props: [],
  data() {
    return {
      ismenu:0,
      // list:datalist
      list:[]
    };
  },
  created() {
    var _this = this;
    this.getData({
      url:_this.$root.Url+'/getdata',
      json:{dbname:'lanmu'},
      type:'post',
      success:function(e){
        if(e.code == 200){
          // console.log(e.lst)
          for(var i in e.lst){
            var o = e.lst[i];
            _this.list.push({
              data:[],
              name:o.name,
              num:o.id,
              img:require('../assets/images/leftbtn1_03.png')
            });
            _this.geterji(_this.list[i].data,o.id);
          }
        }else{
          _this.confirm({title:'app提示',msg:e.info});
        }
      },
      error:function(){
        _this.confirm({title:'app提示',msg:'服务器错误！'});
      }
    });
  },
  methods: {
    geterji(obj,id){
      var _this = this;
      this.getData({
        url:_this.$root.Url+'/getdata',
        json:{dbname:'lanmu2',where:{prid:id}},
        type:'post',
        success:function(e){
          if(e.code == 200){
            // console.log(e.lst)
            for(var i in e.lst){
              var o = e.lst[i];
              obj.push(
                {path:'/',query:{comName:'list',name:o.name,id:o.id}},
              );
            }
          }else{
            _this.confirm({title:'app提示',msg:e.info});
          }
        },
        error:function(){
          _this.confirm({title:'app提示',msg:'服务器错误！'});
        }
      });
    },
    setmenu(num){
      if(num==this.ismenu){
        this.ismenu = 0;
        return;
      };
      this.ismenu = num;
    },
    setactive(name){
      var type = false;
      for(var i in this.$root.router){
        var o = this.$root.router[i];
        if(name == o.comName && o.type){
            type = true;
            break;
        }
      }
      return type;
    }
  },
  computed: {},
  mounted() {
    // this.confirm()
  }
};
</script>
<style scoped>
@import '../assets/css/left.css';
a{color: #fff;}
</style>
